<%@page import="wt.vc.baseline.ManagedBaseline"%>
<%@page import="wt.fc.ReferenceFactory"%>
<%@taglib prefix="wctags" tagdir="/WEB-INF/tags" %>
<%@taglib uri="http://www.ptc.com/windchill/taglib/fmt" prefix="fmt" %>
<%@page import="ext.acae2.baseline.resource.BaselineActionResource" %>

<fmt:setBundle basename="ext.acae2.baseline.resource.BaselineActionResource"/>
<fmt:message var="baseline" key="<%=BaselineActionResource.BASELINE%>" />
<fmt:message var="number" key="<%=BaselineActionResource.NUMBER%>" />
<fmt:message var="name" key="<%=BaselineActionResource.NAME%>" />
<fmt:message var="version" key="<%=BaselineActionResource.VERSION%>" />
<fmt:message var="index" key="<%=BaselineActionResource.INDEX%>" />
<fmt:message var="compareResult" key="<%=BaselineActionResource.COMPARE_RESULT%>" />
<fmt:message var="buttonOK" key="<%=BaselineActionResource.OK%>" />
<fmt:message var="baselineANotEmpty" key="<%=BaselineActionResource.MESSAGE_BASELINE_A_NOT_EMPTY%>" />
<fmt:message var="baselineBNotEmpty" key="<%=BaselineActionResource.MESSAGE_BASELINE_B_NOT_EMPTY%>" />
<fmt:message var="buttonDownload" key="<%=BaselineActionResource.DOWNLOAD_REPORT%>" />

<%
String oid = request.getParameter("oid");
ReferenceFactory refFactory = new ReferenceFactory();
ManagedBaseline baseline = (ManagedBaseline) refFactory.getReference(oid).getObject();
String serverName = request.getServerName();
String contextPath = request.getContextPath();
String scheme = request.getScheme();
String fullPath = scheme+"://"+serverName+contextPath;
%>
<link rel="stylesheet" href="netmarkets/jsp/ocmp/css/comparisonReport.css" type="text/css" />

<table width='80%' style='margin-left:10%'>
    <tr>
        <wctags:itemPicker id="baselineSearchPickerA"
                componentId="baselineSearchPicker"
                objectType="wt.vc.baseline.ManagedBaseline" 
                inline="false"
                readOnlyPickerTextBox="true"
                showTypePicker="false"
                label="* ${baseline}A: "
                pickerCallback="baselineSearchCallbackA"/>
    </tr>
    <tr></tr>
    <tr>
        <wctags:itemPicker id="baselineSearchPickerB"
                componentId="baselineSearchPicker"
                objectType="wt.vc.baseline.ManagedBaseline" 
                inline="false"
                readOnlyPickerTextBox="true"
                showTypePicker="false"
                label="* ${baseline}B: "
                pickerCallback="baselineSearchCallbackB"/>
    </tr>
</table>

<input type="hidden" id="baselineAName" value="<%=baseline.getName()%>"/>
<script type="text/javascript">
document.getElementById("baselineSearchPickerA$label$").value = document.getElementById("baselineAName").value;
</script>

<table width='80%' style='margin-left:10%'>
    <tr><td align="center">
        <input type="button" onclick="compare()" value="${buttonOK}"/>
    </td></tr>
</table>

<input id="baselineA" type="hidden" value="<%=oid%>"/>
<input id="baselineB" type="hidden" value=""/>

<br/>

<table id="compareResultDiv" width='80%' cellpadding='0' cellspacing='0' style='margin-left:10%;border:1px solid black;'>
    <tr>
        <td rowspan='2' class="mainHeader"><font style="font-weight: bold;">${index}</font></td>
        <td colspan='3' class="mainHeader"><font style="font-weight: bold;">${baseline}A</font></td>
        <td colspan='3' class="mainHeader"><font style="font-weight: bold;">${baseline}B</font></td>
        <td rowspan='2' class="mainHeader"><font style="font-weight: bold;">${compareResult}</font></td>
    </tr>
    <tr>
        <td class="mainHeader"><font style="font-weight: bold;">${number}</font></td>
        <td class="mainHeader"><font style="font-weight: bold;">${name}</font></td>
        <td class="mainHeader"><font style="font-weight: bold;">${version}</font></td>
        <td class="mainHeader"><font style="font-weight: bold;">${number}</font></td>
        <td class="mainHeader"><font style="font-weight: bold;">${name}</font></td>
        <td class="mainHeader"><font style="font-weight: bold;">${version}</font></td>
    </tr>
</table>

<table width='80%' align="center">
    <tr>
        <td>
            <input type="button" value="${buttonDownload}" onclick="download()"/>
        </td>
    </tr>
</table>

<script type="text/javascript">
function baselineSearchCallbackA(objects) {
    var baselinePicked = objects.pickedObject;
    var oid = baselinePicked[0].oid;
    var name = baselinePicked[0].name;
    document.getElementById("baselineSearchPickerA$label$").value = name;
    document.getElementById("baselineA").value = oid;
}

function baselineSearchCallbackB(objects) {
    var baselinePicked = objects.pickedObject;
    var oid = baselinePicked[0].oid;
    var name = baselinePicked[0].name;
    document.getElementById("baselineSearchPickerB$label$").value = name;
    document.getElementById("baselineB").value = oid;
}

function compare() {
    var baselineAOid = document.getElementById("baselineA").value;
    var baselineBOid = document.getElementById("baselineB").value;
    
    if (baselineAOid == undefined || baselineAOid == '') {
        alert('${baselineANotEmpty}');
        return;
    }
    
    if (baselineBOid == undefined || baselineBOid == '') {
        alert('${baselineBNotEmpty}');
        return;
    }
    
    Ext.Ajax.request({
        url: '<%=fullPath%>/netmarkets/jsp/ext/acae2/baseline/compareBaselineAjax.jsp',
        success:function(response){
            updateTable(response.responseText.trim());
        },
        failure:function(response){
            
        },
        params:{
            baselineAOid:baselineAOid,
            baselineBOid:baselineBOid
        }
    });
}

function updateTable(result) {
    var result = result.trim();
    var tableDiv = document.getElementById("compareResultDiv");
    
    var row = result.split('|');
    for (var i = 0; i < row.length; i++) {
        var cell = row[i].split('~');
        var rowDiv = tableDiv.insertRow(i + 2);
        
        var indexCell = rowDiv.insertCell(0);
        indexCell.innerHTML = cell[0];
        indexCell.className = "background1";
        
        var aNumberCell = rowDiv.insertCell(1);
        aNumberCell.innerHTML = cell[1];
        aNumberCell.className = "background1";
        
        var aNameCell = rowDiv.insertCell(2);
        aNameCell.innerHTML = cell[2];
        aNameCell.className = "background1";
        
        var aVersionCell = rowDiv.insertCell(3);
        aVersionCell.innerHTML = cell[3];
        aVersionCell.className = "background1";
        
        var bNumberCell = rowDiv.insertCell(4);
        bNumberCell.innerHTML = cell[4];
        bNumberCell.className = "background1";
        
        var bNameCell = rowDiv.insertCell(5);
        bNameCell.innerHTML = cell[5];
        bNameCell.className = "background1";
        
        var bVersionCell = rowDiv.insertCell(6);
        bVersionCell.innerHTML = cell[6];
        bVersionCell.className = "background1";
        
        var resultCell = rowDiv.insertCell(7);
        resultCell.innerHTML = cell[7];
        resultCell.className = "background1";
    }
}

function download() {
    var baselineAOid = document.getElementById("baselineA").value;
    var baselineBOid = document.getElementById("baselineB").value;
    
    if (baselineAOid == undefined || baselineAOid == '') {
        alert('${baselineANotEmpty}');
        return;
    }
    
    if (baselineBOid == undefined || baselineBOid == '') {
        alert('${baselineBNotEmpty}');
        return;
    }
    
    window.open("<%=fullPath%>/netmarkets/jsp/ext/acae2/baseline/downloadCompareBaseline.jsp?baselineAOid="
            + baselineAOid + "&baselineBOid=" + baselineBOid);
}
</script>